<template>
<view class="container">
	<view class="moneylist">
		<view class="list" @click="unearned">
			<view>{{count.money}}</view>
			<view>待收益</view>
		</view>
		<view class="list">
			<view>{{count.total}}</view>
			<view>已收益</view>
		</view>
		<view class="list">
			<view>{{count.score}}</view>
			<view>积分余额</view>
		</view>
	</view>
	<view class="orderlist" v-for="(item,index ) in list" :key="index">
		<view class="orderid ">{{item.type == 1 ? '获得' : '支出'}}<text class="money">{{item.type == 1 ? '获得' : '消费'}}:{{item.score}}</text>
		</view>
		<view class="content">
			<view class="item jobdata">
				<view class="listdata">{{item.remark}}
				</view>
				<view class="listdata1">{{item.addtime}}
				</view>
			</view>
		</view>
	</view>
</view>
</template>
<script>
import request from '@/util/request.js'
export default {
	data() {
		return{
			count:0,
			list:[],
			page:1,
			pageShow:true,
		}
	},
	onLoad:function() {
		uni.showLoading({
		    title: '加载中'  
		});
		this.getMoneyCount();
		this.getMoneyList();
	},
	methods: {
		getMoneyCount:function(){
			var that = this
			var data = {'uid':uni.getStorageSync('uid')}
			request({
				url: 'money/count',
				method: 'get',
				data:data,
				success: (res) => {
					that.count = res.data.data
				}
			})
		},
		getMoneyList:function(){
			var that = this;
			var data = {
				uid:uni.getStorageSync('uid'),
				page:this.page
			}
			request({
				url: 'money/list',
				method: 'get',
				data:data,
				success: (res) => {
					uni.hideLoading();
					if(res.data.code == 1){
						if(res.data.data.last_page <= that.page){
							that.pageShow = false
						}
						if(that.page == 1){
							that.list = res.data.data.data
						}else{
							var list = that.list
							that.list = list.concat(res.data.data.data)
						}
					}
				}
			})
		},
		onReachBottom: function(){
			if(this.pageShow){
				 //当前不是最后一页可加载
				 this.page = this.page + 1
				 uni.showLoading()
				 this.getlist();
			}
		},
		unearned:function(){
			uni.navigateTo({
				url:'/pages/user/money/unearned'
			})
		}
	}
}
</script>

<style>
.container {
    background-color: #f5f5f5;
    min-height: 100%;
}


.moneylist {
    width: 750rpx;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.moneylist .list {
    width: 50%;
    height: 150rpx;
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #FFF;
    font-size: .9rem;
}

.moneylist .list>view {
    height: 75rpx;
    line-height: 75rpx;
    font-weight: 600;
}

.moneylist .list:nth-child(1) {
    background: #e64340;
}

.moneylist .list:nth-child(2) {
    background: #2de09f;
}
.moneylist .list:nth-child(3) {
    background: #ffa14d;
}
.orderlist {
    width: 750rpx;
    display: flex;
    flex-direction: column;
    background: #FFF;
    margin-bottom: 15rpx;
}

.orderid {
    border-bottom: 1rpx solid #efefef;
    padding-top: 20rpx;
    padding-bottom: 20rpx;
    padding-left: 20rpx;
    padding-right: 20rpx;
    font-size: .9rem;
    font-weight: 600;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.content {
    font-size: .8rem;
    border-bottom: 1rpx solid #efefef;
}

.item {
    padding-top: 16rpx;
    padding-bottom: 16rpx;
    padding-left: 20rpx;
    border-bottom: 1rpx dotted #efefef;
    display: flex;
    flex-direction: row;
}
.jobdata {
    color: #999999;
}

.content text {
    color: #2de09f;
    font-weight: 600;
}

.money {
    color: #2de09f;
    font-weight: 600;
}

.listdata {
    margin-right: 30rpx;
}
.listdata1 {
    margin-right: 30rpx;
    font-size:10px;
}
</style>